<template>
	<view class="page-body">
		<view class="block">
			<view class="content">
				<view class="orderinfo">
					<view class="row">
						<view class="nominal">订单名称：</view><view class="text">{{orderName}}</view>
					</view>
					<view class="row">
						<view class="nominal">订单金额：</view><view class="text">{{amount}}元</view>
					</view>
				</view>
			</view>
		</view>
		<view class="paymethod bank-cont paround40" >
			<view class="text-t">选择支付方式</view>
			<radio-group @change="radioChange">
			<label class="flex label" >
				<view>
					<view>支付宝</view> 
				</view>
				<radio value="1" checked="" color="#ff7201"   />
			</label>
			<label class="flex label"  >
				<view>
					<view>云闪付</view> 
				</view>
				<radio value="2"   color="#ff7201" />
			</label>
		
			</radio-group>
			
		</view>
		<view class="pay">
			<view class="btn" @tap="doDeposit">立即支付</view>
			<view class="tis">
				点击立即支付，即代表您同意<view class="terms">
					《条款协议》
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	var that;
	var prevent;
	import {showModal} from '@/utils/utils.js'
	import popDown from "@/components/pop-down.vue";
	export default {
		data() {
			return {
				amount:0,
				orderName:'',
				paytype:'bank',//支付类型
				specClass:"none",
				bankcardList:[],
				selectbankId:"",
				balance:"",
				txn_seqno:"",
				user_id:"",
				currentidx:0,
				bankcard:"",
				openurl:"",
				paymethod:1
			};
		},
		onLoad(e) {
			that=this;
			this.oid = e.oid;
			this.qid = e.qid;
			this.orderName = e.ordername
			this.getOrderMsg();//获取订单信息
			// this.getbalance()
		},
		onShow() {
		},
		methods:{
			goBindCard(){
				uni.navigateTo({
					url:"/pages/user/setting/certification"
				})
			},
			radioChange(e){
				let value = e.detail.value;
				this.paymethod = value
				// if(value==1){ //支付宝
					
				// }else if(value==2){ //云闪付
				
				// }
			},
			getOrderMsg(){
				this.$https.POST({
					url:'/goodsPay/payment',
					data:{
						oid:that.oid
					},
					success(res){
						that.amount = res.data.payable_amount;
						that.orderName = res.data.goods_name;
					}
				})
			},
			doDeposit(e){
				if(this.paymethod==1){ //支付宝
					uni.navigateTo({
						url:"/pages/pay/payment/zhifubao"
					})
				}else if(this.paymethod==2){ //云闪付
					uni.navigateTo({
						url:"/pages/pay/payment/yunshanfu"
					})
				}
				return
				let balance = this.balance;
				let amount = this.amount;
				uni.navigateTo({
					url:"/pages/pay/success/success?orderName="+this.orderName
				})
				// if(parseFloat(balance)<parseFloat(amount)){
				// 	this.$showToast('可用余额不足');
				// 	return false;
				// }
				
					
			},
			
		},
		onUnload() {
			this.specClass = 'none'
		},
		components:{
			popDown
		}
	}
</script>

<style lang="scss">
	.page-body{background: #f6f6f6;}
	.paymethod{
		margin-top: 20upx;background: #fff;padding-top:20upx ;
		.text-t{font-size: 30upx;line-height: 70upx;color: #666;}
		.label{
			justify-content: space-between;min-height: 100upx;border-bottom: 1px solid #efefef;font-size: 32upx; padding: 20upx 0;
			text{
				font-size: 26upx; color:#c3c5d1;
			}
		}
		.label:nth-last-of-type(1){border-bottom: none;}
	}
.block{
		width: 100%; box-sizing: border-box;background: #fff;
		padding: 0 40upx 40upx;
		.title{
			width: 100%;
			font-size: 34upx;line-height: 80upx;
		}
		.content{
			.orderinfo{
				width: 100%;
				border-bottom: solid 1upx #eee;
				.row{
					width: 100%;
					height: 90upx;
					display: flex;
					align-items: center;
					line-height:80upx;
					.nominal{
						flex-shrink: 0;
						font-size: 32upx;
						color: #7d7d7d;
					}
					.text{
						width: 70%;
						margin-left: 10upx;
						overflow: hidden;
						text-overflow:ellipsis;
						white-space: nowrap;
						font-size: 26upx;
					}
				}
			}
			.pay-list{
				width: 100%;
				border-bottom: solid 1upx #eee;
				.row{
					width: 100%;
					height: 100upx;
					display: flex;
					align-items: center;
					line-height:60upx;
					.left{
						width: 100upx;
						flex-shrink: 0;
						display: flex;
						align-items: center;
						image{
							width: 80upx;
							height: 80upx;
						}
					}
					.center{
						width: 100%;
						font-size: 30upx;
					}
					.right{
						text{margin-right: 20upx;}
						flex-shrink: 0;
						display: flex;
						justify-content: flex-end;
					}
				}
			}
		}
	}
	.pay{
		margin-top: 40upx;
		width: 100%;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		.btn{
			width: 70%;
			height: 80upx;
			border-radius: 80upx;
			display: flex;
			justify-content: center;
			align-items: center;
			color: #fff;
			background-color: $maincolor;
			font-size: 30upx;
		}
		.tis{
			margin-top: 20upx;
			width: 100%;
			font-size: 24upx;
			display: flex;
			justify-content: center;
			align-items: baseline;
			color: #999;
			.terms{
				color: #5a9ef7;
			}
		}
	}

</style>
